import React from 'react';
import Svg, { Path } from 'react-native-svg';

import { Colors } from '../../styles/Colors';
import { IIconProps } from './types/Icon';

export const QuestionIcon = ({ size, color }: IIconProps) => {
  return (
    <Svg
      width={size || 48}
      height={size || 48}
      viewBox="0 0 48 48"
      fill={color || Colors.black}
    >
      <Path d="M21.55 31.5c.033-2.4.308-4.15.825-5.25.517-1.1 1.492-2.3 2.925-3.6 1.4-1.267 2.475-2.442 3.225-3.525.75-1.083 1.125-2.242 1.125-3.475 0-1.5-.5-2.75-1.5-3.75s-2.4-1.5-4.2-1.5c-1.733 0-3.067.492-4 1.475-.933.983-1.617 2.008-2.05 3.075l-4.2-1.85c.733-1.967 1.975-3.642 3.725-5.025C19.175 6.692 21.35 6 23.95 6c3.333 0 5.9.925 7.7 2.775 1.8 1.85 2.7 4.075 2.7 6.675 0 1.6-.342 3.05-1.025 4.35-.683 1.3-1.775 2.667-3.275 4.1-1.633 1.567-2.617 2.767-2.95 3.6-.333.833-.517 2.167-.55 4h-5Zm2.4 12.5a3.372 3.372 0 0 1-2.475-1.025A3.372 3.372 0 0 1 20.45 40.5c0-.967.342-1.792 1.025-2.475A3.372 3.372 0 0 1 23.95 37c.967 0 1.792.342 2.475 1.025A3.372 3.372 0 0 1 27.45 40.5c0 .967-.342 1.792-1.025 2.475A3.372 3.372 0 0 1 23.95 44Z"/>
    </Svg>
  );
};
